<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta name="keywords" content="<%= htmlWebpackPlugin.options.i18n.keywords%>">
  <meta name="description" content="<%= htmlWebpackPlugin.options.i18n.description%>">
  <title>
    <%=htmlWebpackPlugin.options.i18n.title %>
  </title>
  <link rel="shortcut icon" type="image/x-icon" href="../static/img/favicon.ico" />
</head>

<body>
  <!--nav-->
  <%= require('../tpl/nav.ejs')({resolve:'',path:'',htmlWebpackPlugin}) %>
    <section>
      <div class="container">
        <header class="website-header">
          <div class="row justify-content-md-center">
            <div class="col-md-10 col-lg-8">
              <ul class="nav nav-justified" id="headerTab">
                <li class="nav-item">
                  <a class="nav-link active" data-toggle="tab" href="#mobile_app">
                    <p>
                      <%=htmlWebpackPlugin.options.i18n.mobile_app%>
                    </p>
                  </a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" data-toggle="tab" href="#extension">
                    <%=htmlWebpackPlugin.options.i18n.browser_extension%>
                  </a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" data-toggle="tab" href="#web">
                    <%=htmlWebpackPlugin.options.i18n.web_wallet%>
                  </a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" data-toggle="tab" href="#hardware">
                    <%=htmlWebpackPlugin.options.i18n.hardware_wallet%>
                  </a>
                </li>
              </ul>
              <div class="tab-content download-btn">
                <div class="tab-pane active row" id="mobile_app">
                  <div class="col-md-7">
                    <h1>
                      <%=htmlWebpackPlugin.options.i18n.slogan%>
                    </h1>
                    <!-- APP -->
                    <%= require('../tpl/app/app.ejs')({resolve:'',i18n:htmlWebpackPlugin.options.i18n,lang:htmlWebpackPlugin.options.lang}) %>
                  </div>
                  <div class="col-md-5">
                    <img src="../static/img/bg/app.png" class="phone">
                  </div>
                </div>
                <div class="tab-pane row" id="extension">
                  <div class="col-md-7">
                    <h1>
                      <%=htmlWebpackPlugin.options.i18n.slogan%>
                    </h1>
                    <ul class="install-box">
                      <li class="d-none d-md-block">
                        <a target="_blank" href="https://chrome.google.com/webstore/detail/math-wallet/afbcbjpbpfadlkmhmclhkeeodmamcflc">
                          <img src="../static/img/icon/forchrome.png" width="24">
                          <span><%=htmlWebpackPlugin.options.i18n.browser_chrome%></span>
                        </a>
                      </li>
                      <li class="d-none d-md-block">
                        <a target="_blank" href="<%=htmlWebpackPlugin.options.i18n.browser_360_link%>">
                          <img src="../static/img/icon/for360.png" width="24">
                          <span><%=htmlWebpackPlugin.options.i18n.browser_360%></span>
                        </a>
                      </li>
                    </ul>
                    <ul class="install-box">
                      <li class="d-md-none">
                        <a class="install-chrome" href="javascript:;">
                          <img src="../static/img/icon/forchrome.png" width="24">
                          <span><%=htmlWebpackPlugin.options.i18n.browser_chrome%></span>
                        </a>
                      </li>
                      <li class="d-md-none">
                        <a class="install-chrome" href="javascript:;">
                          <img src="../static/img/icon/for360.png" width="24">
                          <span><%=htmlWebpackPlugin.options.i18n.browser_360%></span>
                        </a>
                      </li>
                    </ul>
                  </div>
                  <div class="col-md-5">
                    <img src="../static/img/bg/extension.png" class="extension">
                  </div>
                </div>
                <div class="tab-pane" id="web">
                  <div class="web-box">
                    <h1>
                      <%=htmlWebpackPlugin.options.i18n.slogan%>
                    </h1>
                    <ul class="install-box">
                      <% htmlWebpackPlugin.options.config.webWallets.forEach(function(item){%>
                        <li>
                          <a target="_blank" href="https://mathwallet.org/web/<%=item%>">
                        <img src="../static/img/blockchain/<%=item.toLowerCase()%>.png" width="24">
                        <span><%=item+' '+htmlWebpackPlugin.options.i18n.wallet%></span>
                      </a>
                        </li>
                        <%})%>
                    </ul>
                  </div>
                </div>
                <div class="tab-pane row" id="hardware">
                  <div class="col-md-6">
                    <h1>
                      <%=htmlWebpackPlugin.options.i18n.hardware_des%>
                    </h1>
                    <ul class="install-box">
                      <li>
                        <a target="_blank" href="https://weidian.com/item.html?itemID=235747398620902415380&spider_token=061c">
                          <span><%=htmlWebpackPlugin.options.i18n.buy_now%></span>
                        </a>
                      </li>
                    </ul>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </header>
        <!-- 18+ 高性能公链完整支持 -->
        <main class="support-token">
          <h1 class="part-title">
            18+
            <%=htmlWebpackPlugin.options.i18n.public_chain%>
          </h1>
          <div class="row justify-content-between">
            <ul class="token-list col-md-3 col-lg-2">
              <% htmlWebpackPlugin.options.config.supportChain.slice(0,17).forEach(function(item){%>
                <li>
                  <% if(item.ID){%>
                    <a href="../<%=(item.name).replace(/\s*/g,'').toLowerCase()%>-wallet/<%=htmlWebpackPlugin.options.lang%>" target="_blank">
                      <%=item.name%>
                    </a>
                    <%}else{%>
                      <%=item.name%>
                        <%}%>
                </li>
                <% })%>
            </ul>
            <div class="token-pic col-md-9 col-lg-10">
              <div class="move-pic">
                <% for (var i=0;i<=1;i++){%>
                  <img src="../static/img/bg/chains.png" height="100%">
                  <%}%>
              </div>
            </div>
          </div>
        </main>
      </div>
    </section>
    <!-- 底部 -->
    <%= require('../tpl/foot.ejs')({htmlWebpackPlugin}) %>
</body>

</html>